import { WidgetMap } from "@ali-dayu/form-editor";
import getExternalSetter from "./getExternalSetter";
import { optionSetterName } from "./OptionSetter";
import { CodeSetterName } from "./CodeSetter";

const widgetKey = "CheckBoxField";
const externalDataFieldSetterName = "CheckboxExternalDataFieldSetter";

const defaultOptions = [
  {
    key: "option_0",
    value: "选项1",
  },
];

const newConfig = {
  ...WidgetMap[widgetKey],
  cfg: {
    ...WidgetMap[widgetKey].cfg,
    setters: [
      {
        propName: "_id",
        setterName: CodeSetterName,
        props: { label: "表单编码" },
      },
      {
        propName: "enableAsFlowVariable",
        setterName: 'EnableAsFlowVariableSetter',
        props: { label: "是否启用变量" },
      },
      {
        propName: "label",
        setterName: "Input",
        props: {
          label: "标题",
          subLabel: "最多20字",
          maxLength: 20,
          validateMessage: {
            required: "标题不能为空",
          },
        },
      },
      {
        propName: "placeholder",
        setterName: "Input",
        props: {
          label: "提示文字",
          subLabel: "最多50字",
          maxLength: 50,
        },
      },
      {
        propName: "external",
        setterName: externalDataFieldSetterName,
        props: { label: "选项配置" },
      },
      {
        propName: "options",
        setterName: optionSetterName,
        props: {
          label: "选项",
          uploadImageEnable: true,
          otherOptionEnable: false,
        },
      },
      {
        propName: "ratio",
        setterName: "RatioSetter",
        props: {
          label: "字段占比",
        },
      },
      {
        propName: "required",
        setterName: "Switch",
        props: {
          label: "必填",
        },
      },
    ],
    props: {
      label: "多选框",
      placeholder: "请选择",
      options: defaultOptions,
      required: false,
      spread: false,
      ratio: 12,
      enableAsFlowVariable: false,
    },
  },
};

const setting = {
  widget: {
    [widgetKey]: newConfig,
  },
  setter: {
    [externalDataFieldSetterName]: {
      cfg: {
        setterName: externalDataFieldSetterName,
        props: {
          // params: {
          //   multiple: true,
          // },
        },
      },
      extend: getExternalSetter(defaultOptions),
    },
  },
};

export default setting;
